import React, { Component } from 'react'
import AccountLogin from './AccountLogin'
import MobilePhoneLogin from './MobilePhoneLogin'
import { browser } from 'muka'
import './index.less'
import { post } from '../../utils'

export default class Login extends Component<any, any> {

    public state = {
        account: true,
        toggleTitle: '短信密码'
    }

    public render(): JSX.Element {
        const { account, toggleTitle } = this.state
        return (
            <div className="login">
                {(account) ? <AccountLogin {...this.props} /> : <MobilePhoneLogin {...this.props} />}
                <div className="login_operation">
                    <div onClick={() => { this.props.history.push('/loginMode/userRegister') }}>新用户注册</div>
                    <div onClick={() => { this.props.history.push('/loginMode/recoveredPsw') }}>忘记密码</div>
                </div>
                <div className="login_otherLogin">
                    <div className="login_otherLogin_title">其他方式登录</div>
                    <div className="login_otherLogin_iconWrap">
                        {
                            browser.isWX && (
                                <div onClick={this.handleWxLogin}>
                                    <img src={require('../../assets/accountLogin_weChat.png')} />
                                    <p>微信</p>
                                </div>
                            )
                        }
                        <div onClick={this.handleToggleLogin}>
                            <img src={require('../../assets/accountLogin_phone.png')} />
                            <p>{toggleTitle}</p>
                        </div>
                    </div>
                </div>
                <div className="login_Treaty">
                    <p>登录即代表您已同意《<a href="##">中恒隐私政策</a>》</p>
                </div>
            </div>
        )
    }
    private handleToggleLogin = () => {
        this.setState({
            account: !this.state.account,
            toggleTitle: (this.state.account) ? '账号密码' : '短信密码'
        })
    }
    private handleWxLogin = () => {
        post('usersapi/weChatAuthLogin', {
            redirect_uri: location.href
        }).then((data: any) => {
            location.href = data
            // axios.post(data).then((val: any) => {
            //     console.log(val)
            // })
        })
    }
}